<template>
  <div id="head">
    <el-drawer
      :with-header="false"
      :visible.sync="drawer1"
      :direction="direction" id="cnm">
      <registrationIndex v-on:regOutpatientListen="listenRegOutpatientForm"></registrationIndex>
    </el-drawer>
    <el-form ref="form" :model="totalPatientForm" >
    <el-row>
      <el-col :span="24">
        <el-button type="primary" size="mini" @click="drawerFunc" icon="el-icon-arrow-right" circle></el-button>
        <span class="title">当前病人:</span>
        <el-form-item v-if="idHid" label="ID" class="outpatient" prop="patientId">
        <el-input v-model="totalPatientForm.patientId"/>
        </el-form-item>
        <el-form-item  class="outpatient" prop="name">
        <el-input v-model="totalPatientForm.name" disabled/>
        </el-form-item>
        <span class="title">就诊号:</span>
        <el-form-item  class="outpatient_num" prop="medicalRecordNo">
        <el-input v-model="totalPatientForm.medicalRecordNo" disabled/>
        </el-form-item>
        <span class="title">性别:</span>
        <el-form-item  class="outpatient" prop="gender">
        <el-input v-model="totalPatientForm.gender" disabled/>
        </el-form-item>
        <span class="title">年龄:</span>
        <el-form-item class="outpatient" prop="ageStr">
        <el-input v-model="totalPatientForm.ageStr" disabled/>
        </el-form-item>
        <i class="el-icon-success col_lan">诊毕</i>
      </el-col>
    </el-row>
    <el-row>
      <el-col :span="24">
        <el-tabs v-model="activeName" type="card" v-if="frontHide">
          <el-tab-pane label="病历首页" name="medicalRecord" :disabled="medicalRecordDis">
            <outpatientPage v-bind:historyOutPatientDataListen="historyOutPatientData" :param="totalPatientForm" ref="patListen" @outPatientFormListen="outPatientPageForm"></outpatientPage>
          </el-tab-pane>
          <el-tab-pane label="检查申请" name="inspect">
            <checkNonDrugItemRecord :registrationId="totalPatientForm.registrationId"></checkNonDrugItemRecord>
          </el-tab-pane>
          <el-tab-pane label="检验申请" name="test">
            <nonDrugTest :registrationId="totalPatientForm.registrationId"></nonDrugTest>
          </el-tab-pane>
          <el-tab-pane label="门诊确诊" name="diagnosis" :disabled="diagnosisDis">
            <outpatientDiagnosis :param="totalPatientForm" @diagDis="diagnosisDisListen"></outpatientDiagnosis>
          </el-tab-pane>
          <el-tab-pane label="成药处方" name="patientMedicine" :disabled="patientMedicineDis">
            <prescription :registrationId="totalPatientForm.registrationId"></prescription>
          </el-tab-pane>
          <el-tab-pane label="草药处方" name="herbalMedicine" :disabled="herbalMedicineDis">
           <herbalPrescriptionList :registrationId="totalPatientForm.registrationId"></herbalPrescriptionList>
          </el-tab-pane>
          <el-tab-pane label="处置申请" name="disposalApplication" :disabled="disposalApplicationDis">
            <dealWithNonDrugItemRecord :registrationId="totalPatientForm.registrationId"></dealWithNonDrugItemRecord>
          </el-tab-pane>
          <el-tab-pane label="患者账单" name="patientBill">
            <patientBill :registrationId="totalPatientForm.registrationId"></patientBill>
          </el-tab-pane>
        </el-tabs>
      </el-col>
    </el-row>
    </el-form>
  </div>
</template>

<script>
  import {updateRegistration} from "@/api/dms/registration";
  import {getDise} from "@/api/dms/outpatient_page"
  import {addCase_history, getCase_patHistory, getPatientAndReg} from "@/api/dms/outpatient";
  import {getNewCase_history} from "@/api/dms/case_history";
  import outpatientPage from "../outpatient_page/index";
  import registrationIndex from "../registration/index";
  import nonDrugTest from "../non_drug_test/index";
  import outpatientDiagnosis from "../outpatient_diagnosis/index"
  import dealWithNonDrugItemRecord from "../non_drug_item_record/dealWithNonDrugItemRecord"
  import checkNonDrugItemRecord from "../check_the_drugs/checkNonDrugItemRecord";
  import prescription from "../prescription/index"
  import herbalPrescriptionList from "../herbal_prescription_record/herbal_prescription_list";
  import patientBill from "../patient_bill/index"

  export default {
    components: {checkNonDrugItemRecord,outpatientPage, registrationIndex,nonDrugTest,outpatientDiagnosis,dealWithNonDrugItemRecord,herbalPrescriptionList,prescription,patientBill},
    data() {
      return {
        //tab组件刚进去的时候默认可用 状态在操作进行时进行修改
        disposalApplicationDis:false,
        herbalMedicineDis:false,
        patientMedicineDis:false,
        diagnosisDis:false,
        medicalRecordDis:false,
        //前置操作之后显示界面
        frontHide:false,
        idHid: false,
        totalPatientForm: {
          registrationId: '',
          patientId: '',
          patientMedicalRecordNo: '',
          name: '',
          ageStr: '',
          gender: '',
          chiefComplaint: '',
          historyOfPresentIllness: '',
          historyOfTreatment: '',
          pastHistory: '',
          allergies: '',
          healthCheckup: '',
          startDate: '',
          priliminaryDiseIdList: '',
          priliminaryDiseStrList: '',
          assessmentData:[],
          testResult:'',
          checkResult:'',
        },
        direction: 'ltr',
        drawer1: false,
        activeName: 'medicalRecord',
        //控制历史病历的数据 父组件传递子组件
        historyOutPatientData: [],
        //修改挂号号的就诊状态
        registrationIdStatus:{"status":2,id:''}
      };
    },
    created() {
    },
    watch:{
      'totalPatientForm.registrationId' :function(){
        let patientId = this.totalPatientForm.patientId;
        getNewCase_history(patientId).then(response =>{
          //alert(patientId);
            if(response.data!=undefined){
              this.totalPatientForm.patientId = patientId;
              this.totalPatientForm.chiefComplaint=response.data.chiefComplaint;
              this.totalPatientForm.historyOfPresentIllness = response.data.historyOfPresentIllness;
              this.totalPatientForm.historyOfTreatment = response.data.historyOfTreatment;
              this.totalPatientForm.pastHistory = response.data.pastHistory;
              this.totalPatientForm.allergies = response.data.allergies;
              this.totalPatientForm.healthCheckup = response.data.healthCheckup;
              this.totalPatientForm.startDate =response.data.startDate;
              this.totalPatientForm.priliminaryDiseIdList = response.data.priliminaryDiseIdList;
              this.totalPatientForm.priliminaryDiseStrList = response.data.priliminaryDiseStrList;
              this.totalPatientForm.testResult = response.data.testResult;
              this.totalPatientForm.checkResult = response.data.checkResult;
              /*this.medicalRecordDis=true;
              this.activeName = 'inspect';*/
            }else{
              this.totalPatientForm.chiefComplaint = null;
              this.totalPatientForm.historyOfPresentIllness = null;
              this.totalPatientForm.historyOfTreatment = null;
              this.totalPatientForm.pastHistory =null;
              this.totalPatientForm.allergies = null;
              this.totalPatientForm.healthCheckup = null;
              this.totalPatientForm.startDate =null;
              this.totalPatientForm.priliminaryDiseIdList = null;
              this.totalPatientForm.priliminaryDiseStrList = "";
              this.totalPatientForm.testResult = null;
              this.totalPatientForm.checkResult = null;
              /*this.medicalRecordDis=false;
              this.activeName = 'medicalRecord';*/
            }
        })
      }
    },
    methods: {
      drawerFunc(){
        this.drawer1=true;
      },
      diagnosisDisListen: function (data) {
        this.diagnosisDis = data;
        this.herbalMedicineDis = false;
        this.patientMedicineDis = false;
        this.disposalApplicationDis = false;
        this.activeName = 'patientMedicine';
      },
      outPatientPageForm: function (data) {
        this.totalPatientForm.chiefComplaint = data[0].chiefComplaint;
        this.totalPatientForm.historyOfPresentIllness = data[0].historyOfPresentIllness;
        this.totalPatientForm.historyOfTreatment = data[0].historyOfTreatment;
        this.totalPatientForm.pastHistory = data[0].pastHistory;
        this.totalPatientForm.allergies = data[0].allergies;
        this.totalPatientForm.healthCheckup = data[0].healthCheckup;
        this.totalPatientForm.startDate = data[0].startDate;
        var assessmentIdList = '';
        var assessmentStrList = '';
        for (var i = 0; i < data[1].length; i++) {
          assessmentIdList += data[1][i].id + ",";
          assessmentStrList += data[1][i].name + ",";
        }
        //id和name字符串的最后一位逗号的下标
        let idListIndex = assessmentIdList.lastIndexOf(",");
        let strListIndex = assessmentStrList.lastIndexOf(",");
        //id和name字符串去除最后一位的逗号
        assessmentIdList = assessmentIdList.substring(0,idListIndex);
        assessmentStrList = assessmentStrList.substring(0,strListIndex);
        this.$refs["form"].validate(valid => {
          if (valid) {
            var sex = '';
            if (this.totalPatientForm.gender == '男') {
              sex = 0;
            } else {
              sex = 1;
            }
            this.totalPatientForm.gender = sex;
            this.totalPatientForm.priliminaryDiseIdList = assessmentIdList;
            this.totalPatientForm.priliminaryDiseStrList = assessmentStrList;
          }
          if(assessmentIdList.length>0){
            let diseSplitList = assessmentIdList.split(",");
            var list = new Array();
            for(var i = 0;i < diseSplitList.length;i++){
              getDise(parseInt(diseSplitList[i])).then(response => {
                  list.push(response.data);
              });
            }
            this.totalPatientForm.assessmentData = list;
          }
            addCase_history(this.totalPatientForm).then(response => {
              if (response.code === 200) {
                if(this.totalPatientForm.gender ==0){
                  sex = '男'
                }else{
                  sex = '女'
                }
                this.totalPatientForm.gender = sex;
                this.msgSuccess("新增成功");
                this.open = false;
               /* this.medicalRecordDis =true;
                this.herbalMedicineDis = true;
                this.patientMedicineDis = true;
                this.disposalApplicationDis = true;*/
                this.activeName = 'inspect';
              }
            })
        })
      },
      //父组件传值到子组件监听方法
      listenRegOutpatientForm:function(data) {
          getPatientAndReg(data.patientId).then(response => {
            var sex = '';
            if (response.data.gender == 1) {
              sex = '女'
            } else {
              sex = '男'
            }
            this.totalPatientForm.patientId = data.patientId;
            this.totalPatientForm.registrationId = data.registrationId;
            this.totalPatientForm.medicalRecordNo = data.medicalRecordNo;
            this.totalPatientForm.name = data.name;
            this.totalPatientForm.ageStr = data.patientAgeStr;
            this.totalPatientForm.gender = sex;
            this.drawer1=false;
            this.frontHide = true;
            this.registrationIdStatus.id=data.registrationId;
            updateRegistration(this.registrationIdStatus);
            getCase_patHistory(data.patientId).then(response => {
               if (response.rows != undefined) {
                 this.historyOutPatientData = response.rows;
               } else {
                 const h = this.$createElement;
                 this.$notify({
                   title: '提示',
                   message: h('i', {style: 'color: teal'}, '此病患无历史病历')
                 });
               }
             })
          })
      },
    }
  }
</script>
<style>
    .el-drawer.ltr{
      overflow: hidden;
      border:1px solid #ddd
    }
  .el-drawer__body{
    overflow-y: auto!important;
    height: 100%;
    width: calc(100% + 20px);
  }
  .outpatient{
    display: inline-block;
    margin-left: 10px;
    margin-right: 20px;
    width: 7%;
  }
  .title{
    margin-left: 20px;
    font-size: 14px;
  }
  #head{
    margin: auto;
    left: 0;
    right: 0;
    width: 96%;
  }

  .outpatient_num{
    display: inline-block;
    margin-left: 10px;
    margin-right: 20px;
    width: 15%;
  }
  .col_lan{
    color: deepskyblue;
    margin-left: 10px;
  }
  .outpatientCatalogInput{
    margin-bottom: 0px !important;
  }
  .el-col.el-col-24 {
    margin-top: 10px;
  }
    .el-form-item{
      margin: 0;
    }
</style>
